require(['./config'], () => {
    require(['template', 'jquery', 'elevateZoom', 'fly', 'header', 'footer',], (template) => {
        class Shopping {
            constructor() {
                this.zoom().then(() => {
                    this.cartss()
                    this.fly()

                })
                let cart = localStorage.getItem('cart')
                if (cart) {
                    cart = JSON.parse(cart)
                    const totalCount = cart.reduce((count, shop) => count + shop.count, 0)
                    $('#num').html(totalCount)
                }
            }
            zoom() {
                const id = location.search.slice(4)
                return new Promise((resolve, reject) => {
                    $.get('http://www.xiongmaoyouxuan.com/api/detail', { id }, resp => {
                        console.log(resp);
                        if (resp.code === 200) {
                            const {
                                id,
                                title,
                                price,
                                originPrice,
                                saleNum,
                                photo,
                                favoritedCount
                            } = resp.data.detail
                            let {descContentList} = resp.data.detail
                            descContentList = descContentList.filter(tab => tab.photo)
                            console.log(descContentList)
                            
                            var num = parseInt(originPrice - price)
                            this.detail = {
                                id,
                                title,
                                price,
                                originPrice,
                                saleNum,
                                photo,
                                descContentList,
                                favoritedCount,
                                num
                            }


                            $('#exzoom').html(template('scimgshow', { ...this.detail, }))
                            $('#goodsetid').html(template('scgoodsrt', { ...this.detail, }))
                            $('#renderdetailsbx').html(template('scdetailsbx', { ...this.detail, }))
                            resolve()
                        }
                        $(function () {
                            $('.zoom-image').elevateZoom({
                                gallery: 'gal1',
                                cursor: "crosshair",
                                galleryActiveClass: "active",
                                borderSize: "1",
                                borderColor: "#888",
                                lensShape: "round",//透镜形状
                                lensSize: 200,//透镜尺寸：长和宽：200px 
                                zoomType: "lens",//真正的放大镜
                                zoomType: "inner",//透镜内置
                                zoomWindowFadeIn: 500,//镜头窗口淡入速度 
                                zoomWindowFadeOut: 500,//镜头窗口淡出速度 
                                lensFadeIn: 500,//透镜淡入速度 
                                lensFadeOut: 500//透镜淡出速度 
                            })
                        })
                    })
                })
            }
            cartss() {
                $('.btn_shoppingcart').on('click', e => {
                    this.fly(e)
                    let cart = localStorage.getItem('cart')
                    if (cart) {
                        cart = JSON.parse(cart)
                        const isExist = cart.some(shop => shop.id === this.detail.id)
                        if (isExist) {
                            cart = cart.map(shop => {
                                if (shop.id === this.detail.id) shop.count++
                                return shop
                            })
                        } else {
                            cart.push({ ...this.detail, count: 1 })
                        }
                        localStorage.setItem('cart', JSON.stringify(cart))
                    } else {
                        localStorage.setItem('cart', JSON.stringify([{
                            ...this.detail,
                            count: 1
                        }]))
                    }

                })
            }

            fly(e) {
                $(`<img style="width: 30px; height: 30px; border-radius: 50%" src="${this.detail.photo[0].url}">`).fly({
                    start: {
                        left: e.clientX,  //开始位置（必填）#fly元素会被设置成position: fixed
                        top: e.clientY,  //开始位置（必填）
                    },
                    end: {
                        left: $('#carts').offset().left - $(window).scrollLeft(), //结束位置（必填）
                        top: $('#carts').offset().top - $(window).scrollTop()  //结束位置（必填）
                    },
                    speed: 0.6, //越大越快，默认1.2
                    onEnd: function () {
                        this.destroy()
                        // this.calcCartCount()
                        let cart = localStorage.getItem('cart')
                        if (cart) {
                            cart = JSON.parse(cart)
                            const totalCount = cart.reduce((count, shop) => count + shop.count, 0)
                            $('#num').html(totalCount)
                        }
                    }
                })
            }

        }
        new Shopping
    })
})